// import { WithNormalRender } from "@ey-render/hoc-form";
import { WithNormalRender } from "@/biz-components/hoc-form/with-normal";
import { FC, useEffect, useMemo, useState, useRef } from "react";
import { useLocation } from "umi";
import { onFormMount } from '@formily/core';

import components from "@/components/schema-form-render/schema-components-registed/components-biz";

import { useBillParams } from '@/pages/invoice/hooks';

import { xhrPostJson } from '@/services'
import { onFieldInit } from '@formily/core'
import { Form } from "@formily/core/lib/models";

import { useMetaInit } from '@/biz-components/hoc-form/utils';
import DrawerForm from '@/biz-components/hoc-form/with-list/drawer-form';
import { getPageMeta } from "@/services/request/meta";
import {
  formatArrayCollap,
  formatForArrayTable,
  initialSchemaNoraml
} from "@/components/schema-form-render/utils";
import api from "@/pages/archives/archives-manage/services";

interface GeneralDetailProps {}

const GeneralDetail: FC<GeneralDetailProps> = (props) => {
  // @ts-ignore
  const params = useBillParams(props);
  const {businessNo, pageCode, pageType} = params?.query;
  const [visible, setVisible] = useState(false);
  const [loading, setLoading] = useState(false);
  const [detailJson, setDetailJson] = useState<any>({});
  const [drawerPageCode, setDrawerPageCode] = useState('');
  const [drawerConfigs, setDrawerConfigs] = useState<MetaSorted>({});

  const drawerFormRef = useRef<Form<any>>();

  useEffect(() => {
    setLoading(true);
    getPageMeta(drawerPageCode).then(async (res: any) => {
      if (res.success) {
        const sss: any = initialSchemaNoraml(res.result, false, 'DETAIL', {});
        await formatForArrayTable(sss.ArrayTableList, sss.schema, 'DETAIL');
        await formatArrayCollap(sss.ArrayColList, sss.schema, 'DETAIL');
        setDrawerConfigs(sss);
      }
    }).finally(() => {
      setLoading(false);
    });
  }, [drawerPageCode]);

  const initValue = (form: Form<any>) => {
    xhrPostJson(api.rcptDetail, {
      refCode: businessNo,
      refType: pageType,
      pageCode
    }).then((res: any) => {
      if (res.success) {
        form.setValues({ ...res.result })
      }
    })
  }

  const FormLayout: any = useMemo(() => {
    return WithNormalRender({
      filedConfig: {},
      components: {
        ...components,
      },
    });
  }, []);

  return (
    <>
      <FormLayout
        platform={false}
        type="DETAIL"
        remoteUrl="/arcv/mof/pageConfig/getPageConfigByPageCodeFront"
        method="GET"
        pageCode={pageCode}
        formConfigs={{
          effects: () => {
            onFormMount((form) => {
              initValue(form);
            })
            onFieldInit('*.*.*', (field, form) => {
              if (field.props.name === 'detail') {
                const itemsKey = field.path.entire.split('.')[0];
                field.componentProps.onClick = (e: any, index: number, rows: any[]) => {
                  setVisible(true);
                  setDetailJson(_.cloneDeep(rows[index]));

                  form.query(itemsKey).take((state: any) => {
                    setDrawerPageCode(state.componentProps.drawerPageCode);
                  })
                }
              }
            })
          }
        }}
        flag={businessNo}
        filedConfig={{}}
      />
      <DrawerForm
        width={'80%'}
        noOk
        needFormat={false}
        onCancel={() => setVisible(false)}
        title={'详情'}
        loading={loading}
        visible={visible}
        formConfigs={{
          initialValues: {
            ...detailJson
          },
          effects() {
            onFormMount((form) => {
              drawerFormRef.current = form;
            });
          },
        }}
        modalMetasConfig={drawerConfigs}
      />
    </>
  );
};

export default GeneralDetail;
